<!--        Made with 💖 by Menci
/////////////////////////////////////////////
//                                         //
//                                         //
//    +   +                                //
//   +++ +++                               //
//  +++++++++                              //
//    +++++            /\                 ///
//     +++            /  \               / //
//      +            /    \             /  //
//                  /      \           /   //
//                 /        \_________/    //
//                /                        //
//               /       \         /       //
//              /       __\       /__      //
//             /                           //
//            /             ____           //
//           /              \  /           //
//          /     _~_        \/    _~_     //
//         /     /  /             |   |    //
//        /     /  /              |   |    //
//       /     /  /               |   |    //
/////////////////////////////////////////////
-->
<%
// Esacpe </script> in JSON.stringify's result
function safeStringify(object) {
  return JSON.stringify(object).split("<").join("\\u003C");
}

const gitRepoInfo = htmlWebpackPlugin.options.gitRepoInfo;
%>
<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="theme-color" content="#FFFFFF">

  <script>
    window.appVersion = <%= safeStringify({
      hash: gitRepoInfo.abbreviatedSha,
      date: gitRepoInfo.committerDate
    }) %>;

    var addLinkTag = (function () {
      function normalizePath(path) {
        while (path.slice(-1) === "/") path = path.slice(0, -1);
        return path + "/";
      }

      // This is used for specify public path dynamicly for each request. Useful when you have multiple CDN servers.
      // Use ngx_http_sub_module in your server to replace the "__public_path__" placeholder with your CDN path.
      // You may need to add `proxy_set_header Accept-Encoding "";` to disable gzip for upstream traffic.
      // If it's not replaced, the default "/" will be used.
      var publicPath;
      try {
        publicPath = __public_path__;
      } catch (e) {
        publicPath = "";
      }
      publicPath = normalizePath(publicPath);
      window.publicPath = publicPath;

      // Specify the default title (before server info is retrieved) in the same way.
      var title;
      try {
        title = __default_title__;
      } catch (e) {
        title = "SYZOJ";
      }
      document.title = title;

      // Specify the API endpoint in the same way.
      var apiEndpoint;
      try {
        apiEndpoint = __api_endpoint__;
      } catch (e) {
        apiEndpoint = "";
      }
      window.apiEndpoint = normalizePath(apiEndpoint);

      // Specify the polyfill-service URL in the same way.
      var polyfillServiceUrl;
      try {
        polyfillServiceUrl = __polyfill_service__;
      } catch (e) {
        polyfillServiceUrl = "https://polyfill.io";
      }
      window.polyfillServiceUrl = normalizePath(polyfillServiceUrl);

      // Specify the Gravatar CDN URL in the same way.
      var gravatarCdnUrl;
      try {
        gravatarCdnUrl = __gravatar__;
      } catch (e) {
        gravatarCdnUrl = "https://gravatar.com";
      }
      window.gravatarCdnUrl = normalizePath(gravatarCdnUrl);

      // Specify the favicon URL in the same way.
      var faviconUrl;
      try {
        faviconUrl = __favicon__;
      } catch (e) {
        faviconUrl = publicPath + "favicon.ico";
      }

      // Specify the app logo URL in the same way.
      var appLogoUrl;
      try {
        appLogoUrl = __app_logo__;
      } catch (e) {
        appLogoUrl = publicPath + "logo.svg";
      }
      window.appLogoUrl = appLogoUrl;

      // Google Analytics
      var googleAnalyticsId;
      try {
        googleAnalyticsId = __ga__;
      } catch (e) {}
      if (googleAnalyticsId) window.gaId = googleAnalyticsId;

      function addLinkTag(rel, href, onerror) {
        var link = document.createElement("link");
        link.rel = rel;
        link.href = href;
        link.onerror = onerror;
        document.head.appendChild(link);
      }

      addLinkTag("icon", faviconUrl);

      return addLinkTag;
    })();
  </script>

  <style id="initial-style">
    /* Styles for error screen */
    #error {
      position: fixed;
      top: 0;
      left: 0;
      z-index: 999999999;
      width: calc(100vw - 28px);
      margin: 0 14px 0 14px;
      height: 100vh;
      display: flex;
      flex-direction: column;
      align-items: center;
      color: rgba(0, 0, 0, 0.5);
      font-family: "Helvetica Neue", Helvetica, Roboto, "Segoe", Tahoma, sans-serif;
      overflow: auto;
    }

    #error::before,
    #error::after {
      content: "";
      flex-basis: 90px;
      flex-shrink: 999999999;
    }

    #error ::selection {
      background-color: #cce2ff;
    }

    #error-title {
      display: flex;
      align-items: center;
      color: rgba(0, 0, 0, 0.87);
      margin: 32px 0 25px 0;
    }

    #error-icon {
      width: 50px;
      position: relative;
      height: 50px;
      border-radius: 50%;
      border: 2px solid rgba(0, 0, 0, 0.5);
      margin-right: 20px;
    }

    #error-icon::after,
    #error-icon::before {
      position: absolute;
      content: "";
      width: 5%;
      left: 47.5%;
      top: 15%;
      height: 70%;
      background-color: rgba(0, 0, 0, 0.5);
      transform: rotate(-45deg);
    }

    #error-icon::before {
      transform: rotate(45deg);
    }

    #error h1 {
      font-weight: normal;
      font-size: 28px;
      margin: 0;
    }

    #error p {
      margin: 7px 0 7px 0;
      font-size: 14px;
    }

    #error pre {
      box-sizing: border-box;
      max-width: 100%;
      overflow: auto;
      margin: 25px 0 0 0;
      background: #f3f3f3;
      padding: 13px;
      font-size: 13px;
      flex-shrink: 1;
    }

    #error-footer {
      font-size: 13px;
      color: rgba(0, 0, 0, 0.4);
      margin: 25px 0 25px 0;
      text-align: center;
      line-height: 1.4;
    }

    #error a {
      color: #4183c4;
      text-decoration: none;
    }

    #error a:hover {
      color: #1e70bf;
    }

    #error code, #error pre {
      font-family: "Fira Code", "Roboto Mono", "DM Mono", "Menlo", "Consolas", "Ubuntu Mono";
    }

    /* Show the top menu's border and shadow as a preview */
    #root::before {
      content: " ";
      height: 47px;
      width: 100vw;
      border-bottom: 1px solid rgba(34, 36, 38, 0.15);
      box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15);
      box-sizing: content-box;
      position: fixed;
      top: 0;
      left: 0;
      z-index: 102; /* Same as Semantic UI's sidebar menu */
      pointer-events: none;
    }
  </style>

  <!-- Handle script errors -->
  <script>
    function fatalError(messages, stack) {
      var error = document.getElementById("error");
      if (error.style.display === "") return;

      var root = document.getElementById("root");
      if (root) document.body.removeChild(root);

      var styles = document.getElementsByTagName("style");
      for (var i = styles.length - 1; i >= 0; i--) {
        if (styles[i].id === "initial-style") continue;
        styles[i].parentNode.removeChild(styles[i]);
      }

      var footer = document.getElementById("error-footer");

      for (var i in messages) {
        var p = document.createElement("p");
        p.innerText = messages[i];
        error.insertBefore(p, footer);
      }

      if (stack) {
        var pre = document.createElement("pre");
        pre.innerText = stack;
        error.insertBefore(pre, footer);
      }

      error.style.display = "";
    }

    function handleLoadingError() {
      fatalError([
        "There's an error loading the application. Please check your network connection.",
        "加载应用程序时出现错误，请检查您的网络连接。"
      ]);
    }

    // Get session and server info
    function refreshSession(token) {
      function getSessionToken() {
        try {
          var appState = JSON.parse(localStorage["appState"]);
          if (appState.logout) {
            appState.logout = false;
            localStorage["appState"] = JSON.stringify(appState);
          } else
            return appState.token;
        } catch (e) {
          return null;
        }
      }

      if (!token) token = getSessionToken() || "";
      var script = document.createElement("script");
      script.async = true;
      script.onerror = handleLoadingError;
      script.src = window.apiEndpoint + "api/auth/getSessionInfo?jsonp=1&token=" + encodeURIComponent(token);
      document.head.appendChild(script);
    }
    refreshSession();

    (function () {
      // Handle public path for CSS <link> tags
      function addCssLinkTag(href) {
        addLinkTag("stylesheet", href, handleLoadingError);
      }

      <% for (const tag of htmlWebpackPlugin.tags.headTags) { %>
        <%
          if (tag.tagName === "link"
           && tag.attributes
           && tag.attributes.rel === "stylesheet"
           && typeof tag.attributes.href === "string"
           && tag.attributes.href.startsWith("./")
          ) {
        %>
          addCssLinkTag(window.publicPath + <%= safeStringify(tag.attributes.href.substr(2)) %>);
        <% } else { %>
          <% throw new Error(`Couldn't handle this head tag: ${JSON.stringify(tag)}`); %>
        <% } %>
      <% } %>
    })();
  </script>
</head>

<body>
  <div id="root"></div>
  <div id="error" style="display: none; ">
    <div id="error-title">
      <div id="error-icon"></div>
      <h1><code>Error</code></h1>
    </div>
    <div id="error-footer">
      <code>
        Powered by <a href="https://ng.syzoj.org" target="_blank" rel="noreferrer noopener">SYZOJ NG</a><br>
        (version <%= gitRepoInfo.abbreviatedSha %>)
      </code>
    </div>
  </div>

  <!-- Dynamicly generate <script> tags -->
  <script>
    (function () {
      function addScriptTag(src) {
        var script = document.createElement("script");
        script.src = src;
        script.onerror = handleLoadingError;
        document.body.appendChild(script);
        return script;
      }

      // Load polyfill-service
      var polyfillServiceScriptTag = addScriptTag(
        window.polyfillServiceUrl + "v3/polyfill.min.js?features=es2019%2Ces2018%2Ces2017%2Ces2016%2Ces2015%2Ces6"
      );
      polyfillServiceScriptTag.crossOrigin = "anonymous";

      // Delay everything to load after the polyfills loaded
      polyfillServiceScriptTag.onload = function () {
        // Check for cross-origin API endpoint.
        function isCrossOrigin(url) {
          // IE doesn't support parsing urls with `window.URL`. We just check if the url is absolute.
          // Please do NOT use a absolute url if your API server is on the same server
          return /^(https?:\/\/|\/\/)/i.test(url);
        }

        var apiEndpoint = window.apiEndpoint;
        if (isCrossOrigin(apiEndpoint)) {
          // Load xdomain library from API host.
          var apiHostCorsPath = apiEndpoint + "api/cors/";
          var xdomainScriptTag = addScriptTag(apiHostCorsPath + "xdomain.min.js");
          xdomainScriptTag.setAttribute("data-slave", apiHostCorsPath);
        }

        var publicPath = window.publicPath;
        <% for (const tag of htmlWebpackPlugin.tags.bodyTags) { %>
          <%
            if (tag.tagName === "script"
             && tag.attributes
             && typeof tag.attributes.src === "string"
             && tag.attributes.src.startsWith("./")
            ) {
          %>
            addScriptTag(publicPath + <%= safeStringify(tag.attributes.src.substr(2)) %>);
          <% } else if (tag.tagName === "script" && tag.innerHTML) { %>
            <%= tag.innerHTML %>;
          <% } else { %>
            <% throw new Error(`Couldn't handle this body tag: ${JSON.stringify(tag)}`); %>
          <% } %>
        <% } %>
      };
    })();
  </script>
</body>

</html>
